<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>买券</title>
    <link href="css/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="css/aui.css"/>
    <link rel="stylesheet" href="css/shop.css">
    <link rel="stylesheet" href="css/alert.css">
    <script src="js/jquery-1.8.2.min.js"></script>
    <script src="js/mui.min.js"></script>
    <script src="js/init.js"></script>
</head>
<body>
    <header class="mui-bar mui-bar-nav">
        <a href="index.html" class="mui-icon-undo mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title" id="page_title">买券</h1>

    </header>

    <div class="mui-content mui-text-center aui-pad-15 f14">
        <div class="f10 aui-color-gray aui-pad-t-10 nowrap ellipsis">优惠券仅限于在相对应的产品消费使用，请按需酌情购买，理性消费。</div>
        <ul class="quan_list">
            <li class="flex aui-mar-t-15">
                <div class="quan_bg f2"><img src="" alt=""></div>
                <div class="quan_con f5 aui-pad-10 mui-text-left">
                    <div>买iphone8 64G 国行金色</div>
                    <div class="aui-color-red">100元直减券</div>
                    <div class="f10">赠送100积分</div>
                </div>
            </li>
            <li class="flex aui-mar-t-15">
                <div class="quan_bg f2"><img src="" alt=""></div>
                <div class="quan_con f5 aui-pad-10 mui-text-left">
                    <div>买iphone8 64G 国行金色</div>
                    <div class="aui-color-red">100元直减券</div>
                    <div class="f10">赠送100积分</div>
                </div>
            </li>
        </ul>
    </div>
    <div class="fix flex aui-col-10 aui-background-white f12 mui-text-center" style="left:0;bottom:0;height:40px;">
        <div class="f2 f14">
            <span class="duo_jian f20">-</span>
            <input id="buy_num" style="width:30%;height:20px;padding:5px;font:12px/14px '';margin:0 10px;text-align:center;" type="text" value="1">
            <span class="duo_jia">+</span>
        </div>
        <div class="f2" style="line-height: 1.5;">
            <div>实付：￥100</div>
            <div>赠送：<img src="images/zuan.png" alt="" width="10">100</div>
        </div>
        <div class="pay_go f1 aui-background-red aui-color-white" style="line-height:40px;">去付款</div>
    </div>
    <div class="zhifu_tc fix aui-col-10 f12 aui-background-white" style="bottom:-40%;left:0;">
        <div class="aui-pad-10 aui-border-b-gray mui-text-center f14"><span class="zhifu_back fl"><</span>选择支付方式</div>
        <ul>
            <li><img src="images/zhifu_icon.png" alt="" width="">支付宝 <span class="gou fr"><img src="images/pay_xuan.png" alt="" width="15"></span></li>
            <li><img src="images/weixin_icon.jpg" alt="">微信支付 <span class="gou fr none"><img src="images/pay_xuan.png" alt="" width="15"></span></li>
            <li><img src="images/yue_icon.png" alt="">佣金支付 <span>(余额：2000元)</span> <span class="gou fr none"><img src="images/pay_xuan.png" alt="" width="15"></span></li>
        </ul>
        <div class="pay_last aui-background-red aui-pad-10 aui-color-white mui-text-center f14">支付 <span>100</span>元</div>
    </div>

<div class="alert mui-text-center f14 none">
    <div class="duo_touzhu box re">
        <div class="tc_btn">支付成功</div>
        <img src="images/xiaolian.png" alt="" width="70">
        <div class="aui-mar-b-15"> <b>恭喜您支付成功</b></div>
        <div class="yes orange_btn auto">确定</div>
    </div>
    <!--成功-->

    <div class="duo_buzu box re none">
        <div class="tc_btn">积分提示</div>
        <img src="images/kulian.png" alt="" width="70">
        <div class=""> <b>亲，您的积分余额不足</b></div>
        <div class="f12 line-height-2 aui-pad-b-10">新用户可以去 <a href="" style="color:#574502;text-decoration:underline;">福利</a>免费获取积分哦～</div>
        <div class="yes orange_btn auto">确定</div>
    </div>
    <!--失败-->
</div>
</body>
<script src="js/alert.js"></script>
</html>